<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no">
		<title>51微贷</title>
		<link rel="stylesheet" type="text/css" href="../css/reset.css">
		<link rel="stylesheet" type="text/css" href="../css/common.css">
		<link rel="stylesheet" type="text/css" href="../css/icomoon/style.css">
		<script type="text/javascript" src="../js/rem.js"></script>
	</head>

	<body>
		<div class="m-common m-recharge">
			<h3 class="header f-pr">
				<span>充值</span>
				<i class="icon-angle-left f-pa"></i>
			</h3>
			<div class="bankinfo f-pr clearfix">
				<!-- 选择完银行卡后显示 -->
				<!-- <div id="bankinfo">
					<div class="banklogo f-fl"><img src="../images/recharge-icon-1.png"></div>
					<div class="info">
						<p>中信银行(0888)</p>
						<p>限额：5000/笔,2万/日</p>
					</div>
				</div> -->
				<label>选择银行</label>
				<i class="icon-angle-right f-pa"></i>
			</div>
			<p class="tips">
				<i class="warning"></i>
				<span>无忧微贷当前账户余额100元</span>
			</p>
			<ul>
				<li>
					<label>充值金额</label>
					<input type="text" class="amount" placeholder="充值金额不能少于10元">
					<i class="close-icon f-pa"></i>
					<span class="unit f-pa">元</span>
				</li>
			</ul>
			<div class="btn-box">
				<a class="btn active">确认充值</a>
			</div>
			<div class="warm-prompt">
				<p class="tit">温馨提示：</p>
				<p><label>1、</label><span>目前充值不收取任何手续费；</span></p>
				<p><label>2、</label><span>您的资金将从充值银行卡转入合作支付公司的监管账户；</span></p>
				<p><label>3、</label><span>每日的充值额度依据各银行的限额为准，请注意您的银行卡限制，以免造成不便；</span></p>
				<p><label>4、</label><span>如充值成功后未能及时到账，请联系客服：136 3281 8831</span></p>
			</div>
		</div>
		<script type="text/javascript" src="../js/md5.min.js"></script>
		<script type="text/javascript" src="../js/zepto.min.js"></script>
		<script type="text/javascript" src="../js/mui.min.js"></script>
		<script type="text/javascript" src="../js/common.js"></script>
		<script type="text/javascript">
			mui.plusReady(function() {
				$('.icon-angle-left').on('tap', function() {
					mui.back();
				});
				mui.ajax(base + 'account/sitebankcard', {
					type: 'get',
					dataType: 'json',
					headers: sign(md5),
					success: function(data) {
						$('#name').text(data.name);
						$('#bank_no').text(data.bank_no);
						$('#bank_name').text(data.bank_name);
					},
					error: function(XMLHttpRequest, textStatus, error) {
						console.error('获取充值银行卡信息错误：' + XMLHttpRequest.status);
					}
				})
			});
			
			$('.bankinfo').on('tap', function(){
				mui.openWindow({
					url: 'choosebank.html',
					show: {
						aniShow: 'pop-in', 
						event: "loaded"
					}
				});
			});

			$('.btn').on('tap', function(){
				// 未开户进入页面就提示，写在这里只是调试时不显示
				var btnArray = ['知道了', '去开户'];
				mui.confirm('充值前要先开通资金托管账户，请先开户！', '', btnArray, function(e){
					if(e.index == 1){
						//
					}
				});

				// 提示充值金额不能小于10元
				var amount = parseInt($('.amount').val());
				if(amount < 10){
					mui.alert('充值金额不能少于10元');
				}

				if($('#bankinfo').hasClass('hide')){
					mui.alert('请选择充值银行！');
				}

			});
		</script>
	</body>

</html>